<!DOCTYPE html>
<!-- saved from url=(0043)https://www.checkhearing.org/soundmeter.php -->
<html lang="en">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <!-- icons -->
  <link rel="image_src" href="https://www.checkhearing.org/tinnitus/soundmeterimage.png">
  <link rel="apple-touch-icon" sizes="57x57" href="https://www.checkhearing.org/audiogram/apple-touch-icon-57x57.png">
  <link rel="apple-touch-icon" sizes="60x60" href="https://www.checkhearing.org/audiogram/apple-touch-icon-60x60.png">
  <link rel="apple-touch-icon" sizes="72x72" href="https://www.checkhearing.org/audiogram/apple-touch-icon-72x72.png">
  <link rel="apple-touch-icon" sizes="76x76" href="https://www.checkhearing.org/audiogram/apple-touch-icon-76x76.png">
  <link rel="apple-touch-icon" sizes="114x114"
    href="https://www.checkhearing.org/audiogram/apple-touch-icon-114x114.png">
  <link rel="apple-touch-icon" sizes="120x120"
    href="https://www.checkhearing.org/audiogram/apple-touch-icon-120x120.png">
  <link rel="apple-touch-icon" sizes="144x144"
    href="https://www.checkhearing.org/audiogram/apple-touch-icon-144x144.png">
  <link rel="apple-touch-icon" sizes="152x152"
    href="https://www.checkhearing.org/audiogram/apple-touch-icon-152x152.png">
  <link rel="apple-touch-icon" sizes="180x180"
    href="https://www.checkhearing.org/audiogram/apple-touch-icon-180x180.png">
  <link rel="icon" type="image/png" href="https://www.checkhearing.org/audiogram/favicon-32x32.png" sizes="32x32">
  <link rel="icon" type="image/png" href="https://www.checkhearing.org/audiogram/favicon-194x194.png" sizes="194x194">
  <link rel="icon" type="image/png" href="https://www.checkhearing.org/audiogram/favicon-96x96.png" sizes="96x96">
  <link rel="icon" type="image/png" href="https://www.checkhearing.org/audiogram/android-chrome-192x192.png"
    sizes="192x192">
  <link rel="icon" type="image/png" href="https://www.checkhearing.org/audiogram/favicon-16x16.png" sizes="16x16">
  <!-- <link rel="manifest" href="https://www.checkhearing.org/audiogram/manifest.json"> -->
  <meta name="msapplication-TileColor" content="#da532c">
  <meta name="msapplication-TileImage" content="/mstile-144x144.png">
  <meta property="og:title" content="Online Sound Meter">
  <meta property="og:description"
    content="Online sound meter for measuring loudness levels in a room or environment using a computer or device&#39;s microphone.">
  <meta property="og:url" content="https://www.checkhearing.org/soundmeter.php">
  <meta name="twitter:card" content="summary_large_image">
  <meta property="og:image:width" content="1080px">
  <meta name="twitter:image" content="https://www.checkhearing.org/tinnitus/soundmeterimage.png">
  <meta property="og:image" content="https://www.checkhearing.org/tinnitus/soundmeterimage.png">
  <meta name="theme-color" content="#ffffff">

  <title>Online Sound Meter</title>
  <meta name="robots" content="index, follow">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="HandheldFriendly" content="true">
  <meta name="description"
    content="Online sound meter for measuring loudness levels in a room or environment using a computer or device&#39;s microphone.">
  <meta name="keywords"
    content="free online sound meter, sound metering, online loudness level, loudness levels using computer microphone, loudness meter, online loudness levels">
  <link rel="stylesheet" href="./assets/audiohome.css">
  <link rel="stylesheet" href="./assets/navmenu.css">

  <!-- Font Libraries -->
  <link rel="stylesheet" href="./assets/font-awesome.min.css">
  <link rel="stylesheet" type="text/css" href="./assets/icon.css">
  <link rel="stylesheet" type="text/css" href="./style.css">
  <script src="./assets/calibration55db.js" async="" defer=""></script>

  <style>

    /* body{
      width: 240px;
      height: 320px;
    } */
    #sound_meter {
      /* border-bottom: 1px solid #ddd; */
      margin-top: 20px;
      /* padding-bottom: 20px;
      margin-bottom: 20px; */
    }

    #sound_meter .flex {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      justify-content: center;
    }

    #sound_meter .flex .col+.col {
      padding-left: 30px;
      padding-right: 30px;
    }

    #sound_meter #readout {
      background: #fff;
      width: 170px;
      height: 120px;
      text-align: center;
      line-height: 100px;
      border: 3px solid #000000;
      cursor: default;
      margin-bottom: 15px;
      font-size: 40px;
      box-shadow: 3px 3px #888888;
      border-radius: 30px;
    }

    #sound_meter #meter-controls a {
      -ms-flex-preferred-size: 0;
      flex-basis: 0;
      -ms-flex-positive: 1;
      flex-grow: 1;
      max-width: 100%;
      text-align: center;
      -webkit-transition: all .2s;
      -moz-transition: all .2s;
      transition: all .2s;
    }

    #sound_meter #meter-controls a:first-child {
      text-align: left;
    }

    #sound_meter #meter-controls a:last-child {
      text-align: right;
    }

    #sound_meter #meter-info>* {
      margin-bottom: 5px;
    }

    #sound_meter #meter-info #average {
      margin-bottom: 15px;
    }

    #sound_meter #meter-info #label-average,
    #sound_meter #meter-info #label-hold-max {
      font-weight: bold;
      font-size: 16px;
    }

    .calibration_buttons span {
      font-size: 1.5rem;
      background: #122081;
      color: #FFF;
      width: 30px;
      height: 30px;
      line-height: 30px;
      text-align: center;
      cursor: pointer;
    }

    .collapsible {
      background-color: #777;
      color: white;
      cursor: pointer;
      padding: 18px;
      width: 100%;
      border: none;
      text-align: left;
      outline: none;
      font-size: 15px;
    }

    .active,
    .collapsible:hover {
      background-color: #555;
    }

    .contentCollapse {
      padding: 0 18px;
      display: none;
      overflow: hidden;
      background-color: #f1f1f1;
    }
  </style>
  <script src="./assets/soundmeter.js"></script>

</head>

<body>

  <font color="#566573">

    <div class="content">
      <div class="container">

        <div id="sound_meter">
          <div class="flex">
            <div class="col">
              <div id="readout">-</div>
              <div id="meter-controls">
                <div class="flex">
                  <a id="play" href="https://www.checkhearing.org/soundmeter.php#"><i class="play-icon material-icons">
                      <font size="+3">play_arrow</font>
                    </i></a>
                  <a id="pause" href="https://www.checkhearing.org/soundmeter.php#"><i
                      class="pause-icon material-icons">
                      <font size="+3">pause</font>
                    </i></a>
                  <a id="reset" href="https://www.checkhearing.org/soundmeter.php#"><i
                      class="reset-icon material-icons">
                      <font size="+3">cancel</font>
                    </i></a>
                </div>
              </div>
            </div>
            <div class="col">
              <div id="meter-info">
                <div id="label-average">AVG</div>
                <div id="average" onclick="ResetAverage()">-</div>
                <div id="label-hold-max">MAX</div>
                <div id="hold-max" onclick="ResetHoldMax()">-</div>
              </div>
            </div>
            <!-- <div class="col" style="padding-right: 30px">
              <button type="button" class="collapsible active"><i class="material-icons"
                  style="font-size:20px;color:navajowhite">settings_voice</i> &nbsp;Click for Manual
                Calibration</button>
              <div class="contentCollapse" style="display: block;"><br>
                <p style="padding-left: 10px"><strong>** Use with CAUTION and only if<br>you have a calibrator
                    tool.</strong></p>
                <div class="calibration_buttons" style="padding-left: 60px;padding-right: 40px">
                  <span class="calibration-btn calibration-down pull-left">-</span> <span
                    class="calibration-btn calibrate-up pull-right">+</span>
                  <p>&nbsp;</p>
                  <p>&nbsp;</p>
                </div>
              </div>
              <script>
                var coll = document.getElementsByClassName("collapsible");
                var i;

                for (i = 0; i < coll.length; i++) {
                  coll[i].addEventListener("click", function () {
                    this.classList.toggle("active");
                    var content = this.nextElementSibling;
                    if (content.style.display === "block") {
                      content.style.display = "none";
                    } else {
                      content.style.display = "block";
                    }
                  });
                }
              </script>
            </div> -->
          </div>
        </div>

    </div>




  </font>

</body>

</html>